<template>
  <div style="background-color:#fff;width:100%">
    <div class="box flex-al container">
      <!-- <build-el-bread></build-el-bread> -->
      <div class="w100" v-margin-top="'60px'">
        <oneTitle title="大赛背景"></oneTitle>
      </div>
      <el-image
        style=" width: 755px;height: 450px;"
        v-if="details.contestFileId == 1"
        :src="details.contestVideoUrl"
        fit="cover"
      ></el-image>
      <build-el-video
        v-else
        :src="details.contestVideoUrl"
        :poster="home.data.poster"
      ></build-el-video>
      <p class="infom" v-html="details.contestText"></p>
      <div class="w100" style="margin-top:60px;">
        <oneTitle title="赛程安排"></oneTitle>
        <div class="flex-row ">
          <div class="fwb " v-html="details.contestSchedule"></div>
        </div>
        <!-- <build-el-h1 name="奖项说明-黑色.png"></build-el-h1>
      <div class="flex-row mb20">
        <div class="fwb" v-html="details.awardDescription"></div>
      </div>
      <build-el-h1 name="大赛申报流程标题.png"></build-el-h1>
      <div class="flex-row mb20">
        <div class="fwb" v-html="details.contestProcess"></div>
        </div>-->
      </div>
      <Explain></Explain>
      <div v-margin-top="'60px'"></div>
    </div>
  </div>
</template>
<script>
import buildElBread from '@/components/build-el-bread';
import buildElH1 from '@/components/build-el-h1';
import buildElVideo from '@/components/build-el-video';
import buildElHexagon from '@/components/build-el-hexagon';
import Explain from './Explain';
import JSONData from '@/assets/JSON';
export default {
  components: {
    buildElBread,
    buildElH1,
    buildElVideo,
    buildElHexagon,
    Explain,
  },
  data() {
    return {
      ...JSONData,
      details: {},
    };
  },
  async mounted() {
    let res = await this.api.findDownloadFile({ customizeId: 1 });
    this.details = res;
    console.log(this.details, '详情');
  },
};
</script>
<style lang="less" scoped>
.fwb-text {
  margin-top: 70px;
}
.infom {
  margin-top: 37px;
  font-size: 16px;
  color: #333333;
  letter-spacing: 0;
  line-height: 24px;
  display: block;
  text-align: left;
}
.line-row {
  width: 68px;
  margin: 0 30px;
  background: #f03a0a;
}
</style>
<style>
body {
  background: #fff;
}
</style>
